<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!-- 作业1 运算符的扩展-->
    <!-- <script>
      const result1 = 2 ** 3;
      const result2 = Math.pow(2, 3);

      //   普通函数的this
      const obj = {
        value: 42,
        name: function () {
          console.log(this.value); // 42
        },
      };

      obj.name(); // 输出: 42

      //   箭头函数的this
      const obj1 = {
        value: 42,
        name: () => {
          console.log(this.value); // undefined，指向全局对象或外部作用域
        },
      };

      obj1.name(); // 输出: undefined
    </script> -->

    <!-- 作业2 Symbol -->
    <!-- <script>
      // 编写代码创建Symbol，并解释为什么Symbol是唯一的。
      const sym1 = Symbol("name");
      const sym2 = Symbol("name");

      console.log(sym1 === sym2); // false
    //   因为每次调用 Symbol() 都会返回一个全新的、唯一的符号
    </script> -->

    <!-- 作业3 set和map -->
    <!-- <script>
      // 创建 Set 对象
      const mySet = new Set();

      // 添加元素
      mySet.add(1);
      mySet.add(2);
      mySet.add(2);

      // 删除元素
      mySet.delete(1);

      // 检查元素
      console.log(mySet.has(2)); //true
      console.log(mySet.has(1)); //false

      // 计算 Set 的大小
      console.log(mySet.size); //  1

      // 创建 Map 对象
      const myMap = new Map();

      // 添加键值对
      myMap.set("key1", "value1");
      myMap.set("key2", "value2");

      // 删除键值对
      myMap.delete("key1");

      // 遍历 Map
      myMap.forEach((value, key) => {
        console.log(key, value);
      });

      // 获取 Map 的大小
      console.log(myMap.size); // 1
    </script> -->

    <!-- 作业4 -->
    <script>
      var person = {
        name: "何玉婷",
        age: 22,
        gender: "女",
      };

      // Proxy代理  在目标对象中间架设一层拦截
      var p = new Proxy(person, {
        //第一个参数target：被代理的目标对象
        //第二个参数key：读取对象属相名
        // 第三个对象被代理后的对象 p

        get(target, key, receiver) {
          return target[key];
        },
        set(target, key, receiver) {
          console.log(`设置属性: ${key} 为 ${receiver}`);
          return Reflect.set(target, key, receiver);
        },
      });

      console.log(person.name);
      console.log(person.age);
      console.log(person.gender);
      console.log(p.name);
      console.log(p.age);
      console.log(p.gender);
      p.name = "hyt";
      console.log(p.name);

      const obj = {
        key: "value",
      };

      // 判断属性是否存在
      console.log(Reflect.has(obj, "key")); // true
      console.log(Reflect.has(obj, "nonexistentKey")); // false

      // 调用函数
      function greet(name) {
        return `Hello, ${name}!`;
      }
      const result = Reflect.apply(greet, null, ["hyt"]);
      console.log(result);
    </script>
  </body>
</html>
